<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="./css/index2.css">
    <link rel="stylesheet" href="./css/index.css">
    <script>

    </script>
</head>
<body>
<div id="app">
    <span>dom树</span>
</div>
<script>
    //浏览器性能问题
    //浏览器最大的性能消耗
    //dom渲染
    //浏览器在渲染DOM的时候
    //DOM的重绘和回流

    //回流
    //DOM结构发生了改变 元素添加或者删除  修改元素大小或者位置都会引发浏览器的回流

    //重绘
    //元素背景色或者文字大小发生改变,浏览器只需要绘制当前元素的一些变化就可以了

    //回流必定重绘  重绘不一定会引发回流


    //减少重绘和回流
    //减少DOM操作


</script>
</body>
</html>